/*
 * Base structure
 */

/* Move down content because we have a fixed navbar that is 50px tall */
body {
  padding-top: 50px;
}


/*
 * Global add-ons
 */

.sub-header {
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
}

.navbar-brand{
  width: 213px;
  text-align: center;
  background-color: #259;
}
.navbar-default .navbar-brand:hover, 
.navbar-default .navbar-brand:focus{
  background-color: #0B3A79;
  color: #fff;
}
.navbar-default .navbar-brand{
  color: #fff;
}

/*
 * Top navigation
 * Hide default border to remove 1px line.
 */
.navbar-fixed-top {
  border: 0;
  border-bottom: 1px solid #0B3A79;
  box-shadow: 0px 1px 3px #ccc
}

/* 
 * sidebar navigation 
 */
 
/* Hide for mobile, show later */
.sidebar {
  display: none;
}
@media (min-width: 768px) {
  .sidebar {
    position: fixed;
    top: 51px;
    bottom: 0;
    left: 0;
    z-index: 1000;
    display: block;
    padding: 20px;
    overflow-x: hidden;
    overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
    background-color: #f5f5f5;
    border-right: 1px solid #eee;
  }
}
.sidebar > .panel-group{
	margin-left: -20px;
	margin-right: -20px;
	border: none;
	margin-top: 50px;
}
.sidebar > .panel-group > .panel{
	border-right: none;
	border-left: none;
	border-radius: 0;
}
.sidebar > .panel-group > .panel > .panel-heading{
	border-radius: 0;
	padding: 5px;
	background-color: #eee;
}

.sidebar > .panel-group > .panel > .panel-heading > .panel-title{
	font-size: 14px;
}
.sidebar > .panel-group > .panel > .panel-heading > .panel-title > a{
	display: block;
	padding: 10px 10px 10px 35px;
}
.sidebar > .panel-group > .panel > .panel-heading.actived > .panel-title > a{
	background-color: #4196E8;
	color: #fff;
}
.sidebar > .panel-group > .panel > .panel-heading > .panel-title > a > i {
	margin-right: 8px;
}
.sidebar > .panel-group .panel + .panel{
	margin-top: -1px;
}
.sidebar > .panel-group > .panel .list-group{
	margin-bottom: -1px;
}
.sidebar > .panel-group > .panel .list-group-item{
	border-right: none;
	border-left: none;
	padding-left: 50px;
	padding: 5px;
}
.sidebar > .panel-group > .panel .list-group-item > a{
	display: block;
	padding: 6px 30px 6px 50px;
	border-radius: 3px;
}
.sidebar > .panel-group > .panel .list-group-item > a > i{
	margin-right: 8px;
}
.sidebar > .panel-group > .panel .list-group-item > a:hover,
.sidebar > .panel-group > .panel .list-group-item > a:active,
.sidebar > .panel-group > .panel .list-group-item > a:focus,
.sidebar > .panel-group > .panel .list-group-item > a:visited {
	text-decoration: none;
	background-color: #f0f0f0;
}
.sidebar > .panel-group > .panel .list-group-item.actived > a {
	background-color: #4196E8;
	color: #fff;
}
.sidebar > .panel-group > .panel .list-group-item:first-child{
	border-radius: 0;
}
/*
 * main content
 */
 
.main {
  padding: 20px;
}
@media (min-width: 768px) {
  .main {
    padding-right: 30px;
    padding-left: 30px;
  }
}
.main .page-header {
  margin-top: 0;
}

/*
 * for modal
 */
.modal-title,
.modal-body,
.modal-footer{
	font-size: 12px;
}

/*
 * for form field in modal
 */
.modal-dialog form .form-group .checkbox-box{
	margin-top: 4px;
}
.modal-dialog form .form-group .checkbox-box > label{
	margin-right: 10px;
}

/*
 * for image default
 */
 
img.default{
	height: 120px;
}

/*
 * for image mask
 */
.img-box{
	position: relative;
	padding: 0px;
} 
 
.img-box .mask{
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.2)
}

.img-box .file-container{
	position: absolute;
	width: 100%;
	bottom: 0;
	margin: 0px;
	padding: 5px;
	list-style: none;
	font-size: 10px;
	background: rgba(0,0,0,0.5);
	color: #fefefe;
}

.img-box .file-container .progress{
	margin-bottom: 0px;
	height: 1px;
}

.img-box .mask .btn-bare{
	position: absolute;
	font-size: 20px;
	color: #fff;
	top: 50%;
	left: 50%;
	height: 40px;
	width: 40px;
	margin-left: -20px;
	margin-top: -20px;
	background: transparent;
}

.img-box .mask .btn-bare:hover,
.img-box .mask .btn-bare:active{
	background: #aaa;
	background: rgba(255,255,255,0.3)
}

/*
 * for chosen option level
 */
 
.chosen-container .chosen-results li.level-1{
	font-weight: bold;
	padding-left: 5px;
}
.chosen-container .chosen-results li.level-2{
	padding-left: 15px;
}
.chosen-container .chosen-results li.level-3{
	padding-left: 25px;
}
